﻿
@{
    ViewBag.Title = "添加物流模板";
}

@section CSS{
    <link href="~/Content/css/layerui/layui.css" rel="stylesheet" />
    <style>
        .ul_province li { float: left; margin: 5px 8px auto; border: 1px #ccc solid; padding: 5px 15px; }
        .ul_province li:hover { cursor: pointer; border: 1px #666 solid; }
        .ul_area li { float: left; margin: 5px 8px auto; border: 1px #ccc solid; padding: 5px 5px 5px 15px; }
        .ul_area li .delete { position: relative; top: -16px; left: 15px; }
        .radio-box { float: left; margin-left: 15px; margin-top: 5px; }
        .i_float_left span { float: left; line-height: 30px; }
        .i_float_left input { float: left; width: 80px; height: 30px; }
        .area_select { margin-left: 10px; width: 100px; height: 35px; margin-top: 5px; }
        .add_area { margin-left: 5px; position: relative; top: -2px; }
        .distribution_area { border: 1px #ccc solid; margin-bottom: 15px; width: 90%; float: right; padding-left: 20px; }
        .distribution_area .del { float: left; position: relative; top: -11px; left: -31px; }
        .distribution_area .delete:hover { cursor: pointer; }
    </style>

}
<div class="content-wrapper">
    <section class="content-header">
        <h1>
            添加
            <small>运费模板</small>
        </h1>
        <ol class="breadcrumb">
            <li><a href="#"><i class="fa fa-dashboard"></i> 首页</a></li>
            <li><a href="#">系统设置</a></li>
            <li><a href="/tools/FreightTemplate">运费模板</a></li>
            <li class="active">添加运费模板</li>
        </ol>
    </section>
    <section class="content">
        <div class="row">
            <div class="col-md-12">
                <div class="box box-primary">
                    <div class="box-body">
                        <div class="ibox float-e-margins">
                            <div class="ibox-content">
                                <form class="form-horizontal" id="from-template" novalidate="novalidate">

                                    <b style="font-size:16px;">模板基础信息</b>
                                    <div class="form-group" style="margin-top:15px;">
                                        <label class="col-sm-2 control-label">模板名称 <span style="color:red;">*</span>：</label>
                                        <div class="col-sm-4">
                                            <input type="text" name="name" required="" maxlength="50" aria-required="true" id="name" class="form-control" placeholder="请输入模板名称" />
                                            <span class="help-block m-b-none">2-50个字</span>
                                        </div>
                                        @*<label class="col-sm-2 control-label">计费方式：</label>
                                        <div class="col-sm-4">
                                            <div class="radio-box">
                                                <input type="radio" value="2" id="by_piece" name="chargetype">
                                                <label for="by_piece">按件数计费</label>
                                            </div>
                                            <div class="radio-box">
                                                <input type="radio" value="3" id="by_weight" name="chargetype">
                                                <label for="by_weight">按重量计费</label>
                                            </div>
                                        </div>*@
                                    </div>
                                </form>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-md-12">
                <div class="box ">
                    <div class="box-body">
                        <div class="ibox float-e-margins">
                            <div class="ibox-content">
                                <form class="form-horizontal" id="from-free" novalidate="novalidate">
                                    <b style="font-size:16px;">包邮配送区域</b>
                                    <div class="form-group" style="margin-top:15px;">
                                        <label class="col-sm-2 control-label">选择区域&nbsp;&nbsp;：</label>
                                        <div class="col-sm-10">
                                            <ul class="ul_province">
                                                <li id="110000">北京</li>
                                                <li id="120000">天津</li>
                                                <li id="130000">河北</li>
                                                <li id="140000">山西</li>
                                                <li id="150000">内蒙古</li>
                                                <li id="210000">辽宁</li>
                                                <li id="220000">吉林</li>
                                                <li id="230000">黑龙江</li>
                                                <li id="310000">上海</li>
                                                <li id="320000">江苏</li>
                                                <li id="330000">浙江</li>
                                                <li id="340000">安徽</li>
                                                <li id="350000">福建</li>
                                                <li id="360000">江西</li>
                                                <li id="370000">山东</li>
                                                <li id="410000">河南</li>
                                                <li id="420000">湖北</li>
                                                <li id="430000">湖南</li>
                                                <li id="440000">广东</li>
                                                <li id="450000">广西</li>
                                                <li id="460000">海南</li>
                                                <li id="500000">重庆</li>
                                                <li id="510000">四川</li>
                                                <li id="520000">贵州</li>
                                                <li id="530000">云南</li>
                                                <li id="540000">西藏</li>
                                                <li id="610000">陕西</li>
                                                <li id="620000">甘肃</li>
                                                <li id="630000">青海</li>
                                                <li id="640000">宁夏</li>
                                                <li id="650000">新疆</li>
                                                <li id="710000">台湾</li>
                                                <li id="810000">香港</li>
                                                <li id="820000">澳门</li>
                                            </ul>
                                            <span style="display:block;clear:both;padding:20px 0 10px 5px;">已选 <b id="provinceCount" style="color:red;">0</b> 个省份</span>
                                        </div>

                                    </div>
                                    <div class="form-group" style="padding-left:5px;">
                                        <div class="col-sm-2 col-sm-offset-2">
                                            <button class="btn btn-default  btn-block" id="select_all" type="button">全 选</button>
                                        </div>
                                        <div class="col-sm-2 ">
                                            <button class="btn btn-default btn-block" id="select_invert" type="button">反 选</button>
                                        </div>
                                    </div>
                                </form>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <div class="row">
            <div class="col-md-12">
                <div class="box ">
                    <div class="box-body">
                        <div class="ibox float-e-margins">
                            <div class="ibox-content">
                                <form class="form-horizontal" id="from-area" novalidate="novalidate">
                                    <b style="font-size:16px;display:block;margin-bottom:15px;">不包邮配送区域</b>
                                    <div class="form-group" style="margin-top:15px;">
                                        <label class="col-sm-2 control-label">计费方式&nbsp;&nbsp;：</label>
                                        <div class="col-sm-4">
                                            <div class="radio-box">
                                                <input type="radio" value="2" id="by_piece" name="chargetype">
                                                <label for="by_piece">按件数计费</label>
                                            </div>
                                            <div class="radio-box">
                                                <input type="radio" value="3" id="by_weight" name="chargetype">
                                                <label for="by_weight">按重量计费</label>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="distribution_area" id="0_distribution_area"><span style="display:none;" class="f_area_count" id="0_area_count">0</span><img src="/Content/img/icon_close_2.png" class="del delete" onclick="DelAreaGroup(0)"><div class="form-group" style="clear:both;"><label class="col-sm-2" style="width:110px;margin-top:10px;">配送区域&nbsp;&nbsp;：</label><div class="col-sm-8"><ul class="ul_area" id="0_ul_area"></ul><select class="area_select" id="0_select_area"><option value="">-请选择区域-</option><option value="110000">北京</option><option value="120000">天津</option><option value="130000">河北</option><option value="140000">山西</option><option value="150000">内蒙古</option><option value="210000">辽宁</option><option value="220000">吉林</option><option value="230000">黑龙江</option><option value="310000">上海</option><option value="320000">江苏</option><option value="330000">浙江</option><option value="340000">安徽</option><option value="350000">福建</option><option value="360000">江西</option><option value="370000">山东</option><option value="410000">河南</option><option value="420000">湖北</option><option value="430000">湖南</option><option value="440000">广东</option><option value="450000">广西</option><option value="460000">海南</option><option value="500000">重庆</option><option value="510000">四川</option><option value="520000">贵州</option><option value="530000">云南</option><option value="540000">西藏</option><option value="610000">陕西</option><option value="620000">甘肃</option><option value="630000">青海</option><option value="640000">宁夏</option><option value="650000">新疆</option><option value="710000">台湾</option><option value="810000">香港</option><option value="820000">澳门</option></select><button class="btn btn-primary add_area" id="0_add_area" type="button" onclick="AddArea(0)"><i class="fa fa-plus"></i> 增加</button></div></div><div class="form-group"><label class="col-sm-2" style="width:110px;">配送运费&nbsp;&nbsp;：</label><div class="col-sm-2 i_float_left"><span class="fee_tip01" style="padding-left:8px;">首件：</span><input type="number" id="0_first_number" class="form-control f_area_first_num"> <span class="fee_tip02">&nbsp;件</span></div><div class="col-sm-2 i_float_left"><span>首费：</span><input type="text" id="0_first_fee" class="form-control f_area_first_fee"> <span>&nbsp;元</span></div><label class="col-sm-1 control-label">&nbsp;</label><div class="col-sm-2 i_float_left"><span class="fee_tip11">续件：</span><input type="number" id="0_add_number" class="form-control f_area_add_num"> <span class="fee_tip02">&nbsp;件</span></div><div class="col-sm-2 i_float_left"><span>续费：</span><input type="text" id="0_add_fee" class="form-control f_area_add_fee"> <span>&nbsp;元</span></div></div></div>                                   
                                    @*<div class="distribution_area">
                                        <img src="/Content/img/icon_close_2.png" class="del delete" onclick="delAreaGroup(0)" />
                                        <div class="form-group" style="clear:both;">
                                            <label class="col-sm-2" style="width:110px;margin-top:10px;">配送区域&nbsp;&nbsp;：</label>
                                            <div class="col-sm-8">
                                                <ul class="ul_area">
                                                    <li id="110000">北京<img src="/Content/img/icon_close_alt.png" class="delete" onclick="delArea(0,0,this)" /></li>
                                                    <li id="120000">天津<img src="/Content/img/icon_close_alt.png" class="delete" onclick="delArea(0,1,this)" /></li>
                                                    <li id="130000">河北<img src="/Content/img/icon_close_alt.png" class="delete" onclick="delArea(0,2,this)" /></li>
                                                    <li id="140000">山西<img src="/Content/img/icon_close_alt.png" class="delete" onclick="delArea(0,3,this)" /></li>
                                                </ul>
                                                <select class="area_select" id="_select_area"><option value="">-请选择区域-</option><option value="110000">北京</option><option value="120000">天津</option><option value="130000">河北</option><option value="140000">山西</option><option value="150000">内蒙古</option><option value="210000">辽宁</option><option value="220000">吉林</option><option value="230000">黑龙江</option><option value="310000">上海</option><option value="320000">江苏</option><option value="330000">浙江</option><option value="340000">安徽</option><option value="350000">福建</option><option value="360000">江西</option><option value="370000">山东</option><option value="410000">河南</option><option value="420000">湖北</option><option value="430000">湖南</option><option value="440000">广东</option><option value="450000">广西</option><option value="460000">海南</option><option value="500000">重庆</option><option value="510000">四川</option><option value="520000">贵州</option><option value="530000">云南</option><option value="540000">西藏</option><option value="610000">陕西</option><option value="620000">甘肃</option><option value="630000">青海</option><option value="640000">宁夏</option><option value="650000">新疆</option><option value="710000">台湾</option><option value="810000">香港</option><option value="820000">澳门</option></select>
                                                <button class="btn btn-primary add_area" id="add_area" type="button"><i class="fa fa-plus"></i> 增加</button>
                                            </div>
                                        </div>
                                        <div class="form-group">
                                            <label class="col-sm-2" style="width:110px;">配送运费&nbsp;&nbsp;：</label>
                                            <div class="col-sm-2 i_float_left">
                                                <span>首件：</span><input type="number" id="first_number" class="form-control" /> <span>&nbsp;件</span>
                                            </div>
                                            <div class="col-sm-2 i_float_left">
                                                <span>首费：</span><input type="text" id="first-money" class="form-control" /> <span>&nbsp;元</span>
                                            </div>
                                            <label class="col-sm-1 control-label">&nbsp;</label>
                                            <div class="col-sm-2 i_float_left">
                                                <span>续件：</span><input type="number" id="add_number" class="form-control" /> <span>&nbsp;件</span>
                                            </div>
                                            <div class="col-sm-2 i_float_left">
                                                <span>续费：</span><input type="text" id="add-money" class="form-control" /> <span>&nbsp;元</span>
                                            </div>
                                        </div>

                                    </div>*@

                                    <div class="form-group" id="add_area_group_div" style="padding-left:1.6%;margin-top:15px;">
                                        <div class="col-sm-3 col-sm-offset-1"  >
                                            <button class="btn btn-primary btn-block" id=" add_area_group" type="button" onclick="AddAreaGroup(this)"><i class="fa fa-plus"></i> 添加可配送区域和运费</button>
                                        </div>
                                    </div>
                                </form>
                                <div class="form-group" style="margin-top:50px;">
                                    <div class="col-sm-2 col-sm-offset-5">
                                        <button class="btn btn-danger btn-block btnSave" type="button">确认创建</button>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
</div>
@section JS{
<script src="~/Content/js/FreightTemplateAdd.js"></script>
    <script type="text/javascript">
        
    </script>
}

